<template>
  <div class="balance">
    <mt-header title="收藏">
      <router-link to="/user" slot="left">
        <mt-button icon="back"></mt-button>
      </router-link>
    </mt-header>
    <div>
      <mt-cell-swipe
        v-for="(item, index) of list"
        :key="item.goodsId"
        :title="item.goodsName"
        :to="'/detail/' + item.goodsId"
        :right="[
          {
            content: '删除',
            style: { background: 'red', color: '#fff' },
            handler: () => collectDel(item.goodsId, index)
          }
        ]">
        <p>右滑删除</p>
      </mt-cell-swipe>
    </div>
  </div>
</template>

<script>
// import { MessageBox, Toast } from 'mint-ui'
import axios from 'axios'
export default {
  name: 'Collect',
  data () {
    return {
      list: []
    }
  },
  methods: {
    getInfo () {
      axios.get('/meimai/interface/goods/listCollection', {
        params: {
          memberId: this.$store.state.userId
        }
      }).then((res) => {
        let datas = res.data
        console.log(res)
        if (datas.code === 0) {
          console.log(datas)
          this.list = datas.data.array
        }
      })
    },
    collectDel (id, index) {
      axios.get('/meimai/interface/goods/collectGoods', {
        params: {
          memberId: this.$store.state.userId,
          goodsId: id,
          isCollect: false
        }
      }).then((res) => {
        let datas = res.data
        if (datas.code === 0) {
          this.$toast('取消收藏')
          this.list.splice(index, 1)
        }
      })
    }
  },
  mounted () {
    this.getInfo()
  }
}
</script>

<style lang="stylus" scoped>
@import '~styles/mixins.styl'
@import '~styles/varibles.styl'
.mint-header
  background: $colorRed
.mint-cell
  padding: .1rem 0
</style>
